*{
    margin: 0;
    padding: 0;
}
ul li {
    list-style: none;
}

ul{
    width: 700px;
    margin: 20px auto;
}
li{
    width: 100px;
    height: 100px;
    border: 1px solid rgba(100,100,100,.3);
    line-height: 100px;
    text-align: center;
    float: left;
    box-sizing: border-box;
}
.active1{
    background: orangered;
}
.active2{
    background: rgba(100,100,100,.7)
}
h1{
    text-align: center;
    width: 700px;
    margin: 50px auto;
}

h1 .left{
    width: 200px;
    height: 45px;
    float: left
}

h1 .right{
    width: 200px;
    height: 45px;
    float: right
}
.clear{
    clear: both;
    display: block;
    height: 0;
    
}